<div class="qmqnvel">
    <div class="m-subheader">
        <div class="row align-items-center">
            <div class="mr-auto col-auto">
                <h3 class="m-subheader__title m-subheader__title--separator">
                    <span>包络统计表</span>
                </h3>
                <span class="m-section__sub">
                    <!-- {{"OrganizationUnitsHeaderInfo" | localize}} -->
                </span>
            </div>
        </div>
    </div>
    <div class="m-content">
        <div class="ui-g">
            <!-- 左侧 -->
            <div class="ui-g-4 ">
                <!-- 顶部搜索 -->
                <div class="ui-g">
                    <div class="ui-g-5">
                        <!-- 型号 -->
                        <span style="margin-right:5px;">型号：</span>
                        <p-dropdown [options]="Models" [(ngModel)]="modelValue" name="model" filter="true"
                            placeholder="请选择型号" emptyFilterMessage="暂无数据" (onChange)="onChange($event)">
                            <ng-template let-item pTemplate="selectedItem">
                                <span style="vertical-align:middle; margin-left: .3em">{{item.label}}</span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px">{{model.label}}</div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </div>
                    <div class="ui-g-5">
                        <!-- 发次 -->
                        <span style="margin-right: 5px;">发次：</span>
                        <p-dropdown [options]="LotNoList" [(ngModel)]="lotNo" filter="true" placeholder="请选择发次"
                            emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span style="vertical-align:middle; margin-left: .3em">{{item.label}}</span>
                            </ng-template>
                            <ng-template let-fc pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px">{{fc.label}}</div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </div>
                    <!-- 搜索 -->
                    <div class="ui-g-2">
                        <p-button label="搜索" (onClick)="treeSearch()"></p-button>
                    </div>
                </div>
                <!-- 树型结构 -->
                <div>
                    <p-tree [value]="treeData" selectionMode="single" [(selection)]="selectedFiles"
                        (onNodeSelect)="nodeSelect($event)" [style]="{ height: '720px' }" [loading]="loadingtree">
                        <ng-template let-node pTemplate="default">
                            <img class="imgcontent"
                                [src]="(node.nodeLevel==8||node.nodeLevel==9)?'../../../assets/common/images/三级图标.png':node.isLeaf==1?'../../../assets/common/images/二级图标.png':'../../../assets/common/images/一级图标.png'"
                                width="20" height="20" />
                            <span
                                *ngIf="node.key==-1">{{node.model}}-{{node.lotNo}}-{{node.nodeDrawingNo}}-{{node.nodeName}}-{{node.stageSign}}</span>
                            <span *ngIf="node.key!=-1">{{node.nodeDrawingNo}}-{{node.nodeName}}</span>
                            <span class="ptagisExport" *ngIf="node.isReturn==1">{{node.isReturn==1?'已回传':''}}</span>
                        </ng-template>
                    </p-tree>
                </div>
            </div>

            <div class="ui-g-8 ">
                <div class="ui-g" style="margin-top: 7px;">
                    <p-button *ngIf="'Pages.EnvelopeStatistics.Quality' | permission" label="质量报告" (onClick)="reportTo()"></p-button>
                </div>
                <div [ngStyle]="{'height': '720px','background':'#FFFFFF'}">
                    <form [ngStyle]="{'margin-top': '9px'}">
                        <div class="ui-grid ui-grid-responsive ui-grid-pad ui-fluid">
                            <div class="ui-grid-col-1" style="margin-left: 30px;margin-top: 30px;">
                                对比发次:
                            </div>
                            <div class="ui-grid-col-2" style="margin-top: 20px;">
                                <p-multiSelect [options]="LotNoList" defaultLabel="请选择" [(ngModel)]="dblotNo"
                                    styleClass="form-control" [panelStyle]="{minWidth:'12em'}" name="dblotNo">
                                </p-multiSelect>
                            </div>
                            <div class="ui-grid-col-4" style="margin-top: 20px;margin-left: 30px;">
                                <span style="margin-right:20px"> 表名称:</span>
                                <p-dropdown [options]="genders" [(ngModel)]="tablemodel" filter="true" name="tablename"
                                    (onChange)="changeDropDown($event)" placeholder="请选择表名" emptyFilterMessage="暂无数据">
                                    <ng-template let-item pTemplate="selectedItem">
                                        <span
                                            style="vertical-align:middle; margin-left: .5em;width: 200px;">{{item.label}}</span>
                                    </ng-template>
                                    <ng-template let-model pTemplate="item">
                                        <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                            <div style="font-size:14px;float:right;margin-top:4px;width: 200px;">
                                                {{model.label}}</div>
                                        </div>
                                    </ng-template>
                                </p-dropdown>
                            </div>
                            <div class="ui-grid-col-3" style="margin-left: 50px;margin-top: 20px;">
                                <p-button label="搜索" (onClick)="searchRight()" style="margin-right: 30px;">
                                </p-button>
                                <p-button style="margin-right: 30px;" *ngIf="'Pages.EnvelopeStatistics.Export' | permission" label="导出" (onClick)="exportToExcel()"></p-button>
                                <p-button *ngIf="'Pages.EnvelopeStatistics.Export' | permission" label="报表导出" (onClick)="export()"></p-button>
                            </div>
                        </div>
                    </form>

                    <div class="m-portlet__body ui-g-12" *ngIf="workStepData" style="height: 500px;">

                        <div class="primeng-datatable-container processlabel">

                            <p-table [value]="workStepData" [paginator]="false" sortField="fisrtDrawingNum"
                                *ngIf="tablemodel=='力矩记录表'" (onSort)="onSort()" sortMode="single">
                                <ng-template pTemplate="header">
                                    <tr>
                                        <th style="width: 100px" *ngFor="let headerItem of workStepHeader['filedName']">
                                            {{headerItem}}
                                        </th>
                                    </tr>
                                </ng-template>
                                <ng-template pTemplate="body" let-rowData let-rowIndex="rowIndex">
                                    <tr>
                                        <td style="width: 100px">
                                            {{rowIndex+1}}
                                        </td>
                                        <td style="width: 100px"
                                            *ngIf="rowBrandGroup[rowData.fisrtDrawingNum].index == rowIndex"
                                            [attr.rowspan]="rowBrandGroup[rowData.fisrtDrawingNum].size">
                                            {{rowData.fisrtDrawingNum}}
                                        </td>
                                        <td style="width: 100px"
                                            *ngIf="rowBrandGroup[rowData.fisrtDrawingNum].index == rowIndex"
                                            [attr.rowspan]="rowBrandGroup[rowData.fisrtDrawingNum].size">
                                            <!-- {{rowData.fisrtDrawingNum}}
                                            > -->
                                            {{rowData.secondDrawingNum}}
                                        </td>
                                        <td style="width: 100px"
                                            *ngIf="rowBrandGroup[rowData.fisrtDrawingNum].index == rowIndex"
                                            [attr.rowspan]="rowBrandGroup[rowData.fisrtDrawingNum].size">
                                            <!-- {{rowData.fisrtDrawingNum}}
                                            > -->
                                            {{rowData.designerDemand}}
                                        </td>
                                        <td style="width: 100px"
                                            *ngIf="rowBrandGroup[rowData.fisrtDrawingNum].index == rowIndex"
                                            [attr.rowspan]="rowBrandGroup[rowData.fisrtDrawingNum].size">
                                            <!-- {{rowData.fisrtDrawingNum}}
                                            > -->
                                            {{rowData.processorDemand}}
                                        </td>
                                        <td style="width: 100px">
                                            {{rowData.lotNo}}
                                        </td>
                                        <td style="width: 100px">
                                            {{rowData.firstMeasuredValues}}
                                        </td>
                                    </tr>
                                </ng-template>

                            </p-table>
                            <p-table [value]="workStepData" [paginator]="false" sortField="recordLocation"
                                *ngIf="tablemodel=='多媒体记录表'" (onSort)="onSort()" sortMode="single">
                                <ng-template pTemplate="header">
                                    <tr>
                                        <th style="width: 100px" *ngFor="let headerItem of workStepHeader['filedName']">
                                            {{headerItem}}
                                        </th>
                                    </tr>
                                </ng-template>
                                <ng-template pTemplate="body" let-rowData let-rowIndex="rowIndex">
                                    <tr>
                                        <td style="width: 100px">
                                            {{rowIndex+1}}
                                        </td>
                                        <td style="width: 100px"
                                            *ngIf="rowBrandGroup[rowData.recordLocation].index == rowIndex"
                                            [attr.rowspan]="rowBrandGroup[rowData.recordLocation].size">
                                            {{rowData.fisrtDrawingNum}}
                                        </td>
                                        <td style="width: 100px"
                                            *ngIf="rowBrandGroup[rowData.recordLocation].index == rowIndex"
                                            [attr.rowspan]="rowBrandGroup[rowData.recordLocation].size">
                                            {{rowData.recordLocation}}
                                        </td>
                                        <td style="width: 100px">
                                            {{rowData.lotNo}}
                                        </td>
                                        <td style="width: 100px">
                                            <div class="imgList">
                                                <!-- <p-lightbox [images]="getImage(rowData['photoNo'])">
                                                </p-lightbox> -->
                                                <a target="_blank" [href]="item.source" style="padding: 5px;"
                                                    *ngFor="let item of getImage(rowData['photoNo'])">
                                                    <img [src]="item.source" height="30px" width="30px">
                                                </a>
                                                <a target="_blank" [href]="item.source" style="padding: 5px;"
                                                    *ngFor="let item of getVideo(rowData['photoNo'])">
                                                    <i class="pi pi-video" style="font-size: 2em;color:#5599FF;"></i>
                                                </a>
                                            </div>
                                        </td>
                                    </tr>
                                </ng-template>
                            </p-table>
                            <div class="primeng-paging-container">
                                <p-paginator [rows]="primengTableHelper.defaultRecordsCountPerPage" #paginator
                                    (onPageChange)="searchRight()" [totalRecords]="workStepHeader.totalCount"
                                    [rowsPerPageOptions]="primengTableHelper.predefinedRecordsCountPerPage">

                                </p-paginator>
                                <span class="total-records-count">
                                    总计:{{workStepHeader?workStepHeader.totalCount:0}}
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>